/*
 * @author Isis (igraziatto) Graziatto <isis.g@vanillaforums.com>
 * @copyright 2009-2018 Vanilla Forums Inc.
 * @license GPL-2.0-only
 */

/* -------------------------------------------------------------- *\
    Utility Variables
\* -------------------------------------------------------------- */

@use "sass:math";

$utility-baseUnit: 6px;
$utility-baseUnitHalf: $utility-baseUnit * 0.5; // Derived
$utility-baseUnitDouble: $utility-baseUnit * 2; // Derived
$utility-baseUnitTriple: $utility-baseUnit * 3; // Derived
$utility-percentage_third: math.div(100%, 3);
$utility-percentage_nineSixteenths: (math.div(9, 16) * 100%);
$utility-SVGEncoding: "data:image/svg+xml,";

/* -------------------------------------------------------------- *\
    Global Overwrites
\* -------------------------------------------------------------- */

$global-color_black: #000;
$global-color_white: #fff;
$global-color_transparent: transparent;

$global-color_dusk: #111423;
$global-color_evening: #192231;
$global-color_grey: #a3a3a3;
$global-color_cloud: #49648b;
$global-color_sunset: #985e6d;

$global-color_primary: $global-color_sunset !default;
$global-color_primaryAlt: darken($global-color_primary, 8%) !default;
$global-color_secondary: $global-color_cloud !default;

$global-color_bg: $global-color_dusk !default;
$global-color_fg: $global-color_white !default; // text color | should have high contrast between $global-color_bg

$global_borderRadius: 6px !default;

$theme-border_color: mix($global-color_fg, $global-color_bg, 12%) !default;

/* -------------------------------------------------------------- *\
    Global Overwrites
\* -------------------------------------------------------------- */

$link-default_color: $global-color_grey !default;
$link-default-hover_color: $global-color_primary !default;
$link-default_visited_color: $global-color_primary !default;

$theme-link-hover_textDecoration: underline !default;

/* -------------------------------------------------------------- *\
    Buttons Colors
\* -------------------------------------------------------------- */

$button-basic_fg: $global-color_white !default;
$button-basic_bg: mix($global-color_white, transparent, 8%) !default;
$button-basic_border: $global-color_white !default;

$button-basic-hover_fg: $global-color_primary !default;
$button-basic-hover_bg: $button-basic_bg !default;
$button-basic-hover_border: $global-color_primary !default;

$button-primary_fg: $global-color_white !default;
$button-primary_bg: $global-color_primary !default;
$button-primary_border: $global-color_primary !default;

$button-primary-hover_fg: $global-color_white !default;
$button-primary-hover_bg: $global-color_primaryAlt !default;
$button-primary-hover_border: $global-color_primaryAlt !default;

/* -------------------------------------------------------------- *\
    Frame
\* -------------------------------------------------------------- */

$frame_bg: $global-color_evening !default;

/* -------------------------------------------------------------- *\
    Header
\* -------------------------------------------------------------- */

$header_bg: $global-color_bg !default;
$headerMebutton-hover_bg: $frame_bg !default;
$headerMebutton-active_bg: lighten($frame_bg, 8%) !default;

/* -------------------------------------------------------------- *\
    Footer
\* -------------------------------------------------------------- */

$footer_bg: darken($global-color_evening, 2%) !default;

/* -------------------------------------------------------------- *\
    Navigation
\* -------------------------------------------------------------- */

$navigation_bg: mix($global-color_white, $header_bg, 12%) !default;
$navigation_fg: $global-color_fg !default;
$navigation-boxShadow: 0 5px 10px 0 rgba(255, 255, 255, 255.3);
$navigation-hover_fg: $navigation_fg !default;
$navigation_border: darken($navigation_bg, 8%) !default;

$navigationButton_bg: $global-color_secondary !default;
$navigationButton_fg: $button-primary_fg !default;
$navigationButton_border: $global-color_secondary !default;

$navigationButton-hover_bg: lighten($global-color_secondary, 8%) !default;
$navigationButton-hover_fg: $button-primary-hover_fg !default;
$navigationButton-hover_border: $navigationButton-hover_bg !default;

/* -------------------------------------------------------------- *\
    Mobile Mebox
\* -------------------------------------------------------------- */

$MobileMeBox_bg: mix($global-color_white, $header_bg, 12%) !default;
$MobileMeBox_fg: $global-color_fg !default;

$MobileMeBoxAlert_fg: $MobileMeBox_fg !default;
$MobileMeBoxAlert_bg: $global-color_secondary !default;
$MobileMeBoxAlert_borderColor: $global-color_secondary !default;

/* -------------------------------------------------------------- *\
    Components
\* -------------------------------------------------------------- */

$component-item_spacing: 0 !default;
$component_bg: $global-color_bg !default;
$component_lateralBorder: true !default;
$component_borderRadius: $global_borderRadius !default;
$component_borderWidth: 1px !default;
$component_borderColor: $theme-border_color !default;

/* -------------------------------------------------------------- *\
    Tags
\* -------------------------------------------------------------- */

$tag_borderRadius: 20px !default;
$tag_bg: transparent !default;
$tag_fg: $global-color_grey !default;
$tag_borderColor: $global-color_grey !default;
$tag-hover_bg: $global-color_primary !default;
$tag-hover_fg: $global-color_white !default;
$tag-hover_borderColor: $global-color_primary !default;

/* -------------------------------------------------------------- *\
    Count
\* -------------------------------------------------------------- */

$count_bg: $frame_bg !default;
$count_border: 1px solid transparent !default;
$count_color: $global-color_grey !default;

$count-hover_bg: $global-color_primary !default;
$count-hover_borderColor: $global-color_primary !default;
$count-hover_color: $global-color_white !default;

/* -------------------------------------------------------------- *\
    Form Elements
\* -------------------------------------------------------------- */

$formElement_borderRadius: 20px !default;

/* -------------------------------------------------------------- *\
    Form Buttons
\* -------------------------------------------------------------- */

$formButton_borderRadius: 20px !default;
